<template>
  <div>
    <el-container>
      <el-header style="text-align: center; font-size: 20px;">
        <el-page-header @back="goBack"  title="返回登录页" content="找回密码">
        </el-page-header>
      </el-header>
      <el-divider></el-divider>
      <el-main>
        <div style="margin: 20px;"></div>
        <el-form :label-position="labelPosition" label-width="140px" :model="id">
          <el-form-item label="请输入身份证号">

            <el-input v-model="id.id1"></el-input>
          </el-form-item>
          <el-form-item label="请再次输入身份证号">
            <el-input v-model="id.id2"></el-input>
            <span v-if="this.id.id1===this.id.id2&&this.id.id1.length>0" class="el-icon-check" style="color: #67C23A;">两次身份证号输入相同</span>
          </el-form-item>
        </el-form>
        <el-row>
          <el-button type="text" @click="sendId" style="margin-left: 615px; font-size: larger">查询密码</el-button>
        </el-row>
      </el-main>

    </el-container>
  </div>
</template>

<script>
export default {

  name: "ResetPassword",
  data() {
    return {
      labelPosition: 'top',
      id: {
        id1: '',
        id2: ''
      },
      password:''
    };
  },
  methods:{
    goBack() {
      this.$router.push('/login');
    },
    sendId(){
      if(this.id.id1===this.id.id2&&this.id.id1.length>0){
        this.axios({
          method:"post",
          headers: { 'content-type': 'application/json' },
          url: "http://evidence.frogking.cn/userController/selectByIdCardNumber",
          params:{
            idcardNumber: this.id.id1,
          }
        }).then(res=>{
          //console.log(res["data"]);
          if(res["data"]["code"]==='206'){
            this.password=res["data"]["item"]["password"];
            this.$alert('您的密码是: \"'+this.password+'\"。如需更改密码，请报备管理员进行处理。', '用户密码', {
              confirmButtonText: '我已保存密码',
              callback: action => {
                this.id.id1='';
                this.id.id2='';
              }
            });
          }
          else if(res["data"]["code"]==='210'){
            this.$alert('身份证号码错误或对应用户不存在，请重新输入身份证号码。', '错误提示', {
              confirmButtonText: '确定',
              callback: action => {
                this.id.id1='';
                this.id.id2='';
              }
            });
          }

        }).catch(function (error) {
          console.log(error);
        });
      }
      else{
        this.open()
      }
    },
    open() {
      if(this.id.id1.length*this.id.id2.length===0){
        this.$alert('身份证号输入为空，请输入相应身份证号！', '错误信息', {
          confirmButtonText: '确定',
          callback: action => {
            this.id.id1="";
            this.id.id2="";
          }
        });
      }
      else{
        this.$alert('两次身份证号内容不同，请重新输入！', '错误信息', {
          confirmButtonText: '确定',
          callback: action => {
            this.id.id1="";
            this.id.id2="";
          }
        });
      }
    }
  }
}
</script>

<style scoped>

</style>
